<template>
    <div class="jrHumanConfirmMoney">
        <van-nav-bar title="开票信息上传" left-text="返回" left-arrow border fixed @click-left="$router.go(-1)" />
        <div style="height:50px"></div>
        <van-cell-group>
            <van-field v-model="companyName" label="客户名称" disabled size="large" />
            <van-field v-model="price" label="订单金额" placeholder="" disabled size="large" />
        </van-cell-group>
        <div class="up-img">
            <div><span style="color: red;">*</span>发票凭据上传</div>
            <van-uploader v-model="business_license" multiple :max-count="1" :after-read="afterRead" :name="1">
                <img class="up-icon" src="../../../assets/img/money_evidence.png" alt="">
            </van-uploader>
        </div>
        <div class="foot-btn">
            <div class="blue-btn" @click="makeInvoice">确认开票</div>
            <div class="red-btn" @click="$router.go(-1)">取消</div>
        </div>
    </div>
</template>

<script>
export default {
    name: "jrConfirmInvoice",
    data() {
        return {
            business_license: [], //发票图片
            qiniuToken: '',
            info: { annex: '' },
            companyName: '',
            price: '',
        };
    },
    methods: {

        getInfo() {
            let data = {
                wx_member_id: localStorage.getItem('wx_member_id'),
                token: localStorage.getItem('token'),
                id: this.$route.query.id,
            }
            this.$post("/api/order_detail/confirm_billing", data)
                .then(res => {
                    if (res.code == 1) {
                        this.companyName = this.$route.query.name
                        this.price = this.$route.query.price
                    } else {

                    }
                })
                .catch(err => {
                });

        },
        getQiniuToken() {
            this.$post("/api/qiniu/up_token", {})
                .then(res => {
                    this.qiniuToken = res
                })
                .catch(err => {
                });

        },
        afterRead(file) {
            this.$Toast.loading({
                message: '上传中',
                duration: 0,
                forbidClick: true
            });
            this.$QiniuUpload(this.qiniuToken, file)
                .then(res => {
                    this.$Toast.clear();
                    this.business_license = [
                        { url: this.qiniuToken.domain + res.key },
                    ]
                    this.info.annex = this.qiniuToken.domain + res.key
                })
                .catch(err => {
                    this.$Toast.clear();
                });

        },
        makeInvoice() {
            // this.$Dialog.confirm({
            //     title: '温馨提示',
            //     message: '确认开票么？',
            //     closeOnPopstate: true,
            // }).then(() => {
            //     if (this.info.annex == '') {
            //         this.$Toast('请上传发票图片')
            //         return
            //     }
            //     let params = {
            //         token: localStorage.getItem('token'),
            //         wx_member_id: localStorage.getItem('wx_member_id'),
            //         type: 1,//保险 1  其他 2
            //         order_id: this.$route.query.id,
            //         invoice_image: this.info.annex,
            //     }

            //     this.$post("/api/finance/to_invoice", params)
            //         .then(res => {
            //             this.$Toast(res.msg);
            //             if (res.code == 1) {
            //                 setTimeout(() => {
            //                     this.$router.go(-1)
            //                 }, 1500)
            //             }
            //         })
            //         .catch(err => {
            //         });
            // })
        },
    },
    created() {
        // 实例创建完成
        this.getQiniuToken()
        this.getInfo()
    },
    beforeCreate() {
        document.querySelector("body").setAttribute("style", "background-color:#fff");
    }
}
</script>

<style scoped lang='less'>
.up-img {
    height: 120px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    color: #333;
    font-size: 13px;
    padding-right: 15px;
    margin-bottom: 15px;
    margin-top: 20px;

    > div:nth-of-type(1) {
        margin-left: 13px;
        margin-right: 22px;
    }

    .up-icon {
        width: 57vw;
        height: 112px;
    }
}

.foot-btn {
    padding-bottom: 80px;
    display: flex;
    justify-content: center;
    align-items: center;
    margin-top: 32px;
}
</style>